<template>
	<view class="wrap">
		<v-top-header />
		<view class="avatar-block">
			<u-avatar :src="vuex_logo" size="140"></u-avatar>
		</view>

		<u-cell-group>
			<u-cell-item title="登录账号" :value="vuex_user.username" :arrow="false"></u-cell-item>
			<u-cell-item title="IP地址" :value="vuex_ip_current.ip" :arrow="false"></u-cell-item>
			<u-cell-item title="服务端口" :value="vuex_ip_current.server_port" :arrow="false"></u-cell-item>
			<u-cell-item title="设备端口" :value="vuex_ip_current.device_port" :arrow="false"></u-cell-item>
		</u-cell-group>

		<view class="logout-block">
			<u-button class="logout" size="medium" type="primary" @click="logout">
				<text>退出</text>
			</u-button>
		</view>
	</view>
</template>

<script>
	import vTopHeader from '@/components/v-top-header.vue'
	export default {
		components: {
			vTopHeader
		},
		data() {
			return {}
		},
		methods: {
			logout() {
				uni.redirectTo({
					url: '../login/index'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wrap {

		.avatar-block {
			display: flex;
			flex-direction: column;
			align-items: center;
			padding: 120upx 0;
		}

		.logout-block {
			padding: 0 40upx;

			.logout {
				width: 100%;
				height: 80upx;
				margin-top: 100rpx;
				font-size: 32upx;
				background-color: #000;
			}
		}
	}
</style>
